<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>call</title>
    <style>
        .call-wraper{
            width: 100%;
            margin: 0 auto;
            padding: 20px 0;
        }
        .call-container{
            width: 320px;
            height: auto;
            margin: 0 auto;
        }
        .call-title{
            text-align: center;
            font-size: 16px;
            font-weight: 700;
            color: #333;
        }
        .call-info{
            padding: 0;
            list-style: none;
        }
        li{
            padding: 10px;
        }
        span{
            display: inline-block;
            min-width: 100px;
            text-align: right;
        }
        .con{
            text-align: left;
            padding-left: 5px;
        }
        .call-btns{
            text-align: center;
        }
        button{
            width: 80px;
            height: 36px;
            margin: 0 10px;
            border: none;
            color: white;
        }
        button.hide{
            display: none;
        }
        .answer{
            background-color: #13ce66;
        }
        .turnDown,.hangUp{
            background-color: #ff4949;
        }
    </style>
</head>
<body>
<div class="call-wraper">
    <div class="call-container">
        <div class="call-title">客户呼入</div>
        <ul class="call-info">
            <li><span>呼入电话：</span><span class="con" id="number"></span></li>
            <li><span>客户名称：</span><span class="con" id="name"></span></li>
            <li><span>客户类别：</span><span class="con" id="level"></span></li>
            <li><span>销售员：</span><span class="con" id="seller"></span></li>
            <li id="res"></li>
        </ul>
        <div class="call-btns">
            <button class="answer" id="answer" onclick="answer()" type="button">接听</button>
            <button class="turnDown" id="turnDown" onclick="turnDown()" type="button">拒绝</button>
            <button class="hangUp hide" id="hangUp" onclick="hangUp()" type="button">挂断</button>
        </div>
    </div>
</div>
<script src="//cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8">

    var locationUrl = 'http://127.0.0.1:3366',
            /*baseUrl = 'http://localhost:8080',
             URL = 'http://localhost:8010',*/
        baseUrl = 'http://longxi.groupfly.cn:58231/api',
        URL = 'http://longxi.groupfly.cn:58231',
        dhhm = null,
        existCustomer = false,
        customerData = null,
        numEl = document.getElementById('number'),
        nameEl = document.getElementById('name'),
        levelEl = document.getElementById('level'),
        sellerEl = document.getElementById('seller');

    window.onload = function () {
        if(!location.search) return;
        var param1 = location.search.split('=')[1];
        dhhm = base64Decode(param1).split('&')[1].split('=')[1];
        numEl.innerHTML = dhhm;
        $.ajax({
            method: 'POST',
            url: baseUrl + "/customer/getCustomerInfoByPhoneNo",
            data: {
                phone: dhhm
            },
            success: function (res) {
                customerData = res.data;
                if(customerData) {
                    existCustomer = true;
                    nameEl.innerHTML = customerData.customerName;
                    levelEl.innerHTML = customerData.customerTypeName;
                    sellerEl.innerHTML = customerData.name;
                }
            }
        });
    };

    function answer() {
        $.ajax({
            method: 'GET',
            url: locationUrl + "/callaccept?phone=" + dhhm + '&callback=cbkName&accept=1',
            dataType : 'jsonp',

            success: function (res) {}
        });
        document.getElementById('answer').style.display = 'none'
        document.getElementById('turnDown').style.display = 'none'
        document.getElementById('hangUp').className = "hangUp";
        if(existCustomer) {
            window.open(URL + "/customer/detail?id="  + customerData.id + '&customerContactId=' + customerData.customerContactId + '&from=index&customerName=' + customerData.customerName+'&fromIndex=tel');
        }else {
            window.open(URL + "/customer/add?phone=" + dhhm + "&fromIndex=tel");
        }
    }

    function turnDown() {

        $.ajax({
            method: 'GET',
            url: locationUrl + "/callaccept?phone=" + dhhm + '&callback=cbkName&accept=0',
            dataType : 'jsonp',
            success: function (res) {

            }
        });
    }

    function hangUp() {
        $.ajax({
            method: 'GET',
            dataType : 'jsonp',
            url: locationUrl + "/callhang?callback=cb_callout",
            success: function (res) {}
        });
    }

    function base64Decode(input) {
        var _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
        var output = "";
        var chr1, chr2, chr3;
        var enc1, enc2, enc3, enc4;
        var i = 0;
        input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
        while (i < input.length) {
            enc1 = _keyStr.indexOf(input.charAt(i++));
            enc2 = _keyStr.indexOf(input.charAt(i++));
            enc3 = _keyStr.indexOf(input.charAt(i++));
            enc4 = _keyStr.indexOf(input.charAt(i++));
            chr1 = (enc1 << 2) | (enc2 >> 4);
            chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
            chr3 = ((enc3 & 3) << 6) | enc4;
            output = output + String.fromCharCode(chr1);
            if (enc3 != 64) {
                output = output + String.fromCharCode(chr2);
            }
            if (enc4 != 64) {
                output = output + String.fromCharCode(chr3);
            }
        }
        return output;
    }

</script>
</body>
</html>